// 将node内置的path方法引入进来
const path = require('path')

module.exports = {
  css: {
    loaderOptions: {
      less: {
        modifyVars: {
          // 方法1：直接覆盖变量
          // 'nav-bar-background-color': '#007bff',
          // 'nav-bar-title-text-color': '#fff'

          // 方法2：可以通过 less 文件覆盖（文件路径为绝对路径）
          // 因为vue.config.js文件是对webpack进行配置
          // 所以在webpack中获取文件的绝对路径需要使用__dirname
          // webpack运行在node环境中（后端环境）在node环境中引入的所有文件都必须以绝对路径的方式引入
          // 在webpack中拼接路径推荐使用path.resolve来实现路径的拼接
          hack: `true; @import "${path.resolve(__dirname, 'src/styles/cover.less')}";`
        }
      }
    }
  }
}
